<script setup lang="ts">
import { requiredCheck, singleIpCheck, validatePortCheck } from "@/utils/verify";
import { ref } from "vue";
import { addData, editData } from "@/api/modules/resource/sample-finger";
import SelectAppInput from "@/components/SelectAppInput/index.vue";
import FingerText from "./components/FingetText/index.vue";

interface Props {
  title?: string;
  rowData?: Object;
}

const props = withDefaults(defineProps<Props>(), {
  title: "选择指纹样例",
  rowData: undefined
});
defineOptions({
  name: "UpdateForm" // 默认策略
});
import useUpdate from "@/hooks/useUpdate";
import { ifaceAll, ifacemodeUpdate } from "@/api/modules/dynamic-camouflage/line-config";
import SelectLinksInput from "@/components/SelectLinksInput/index.vue";

const emits = defineEmits(["success", "select"]);
const { updateFormData, updateFormRef, updateFormRules, submit, showHandle, openHandle, closeHandle } = useUpdate({
  rules: {
    name: [...requiredCheck("请输入指纹名称")],
    app: [...requiredCheck("请选择协议")],
    port: [...requiredCheck("请输入端口"), { validator: validatePortCheck }],
    text: [...requiredCheck("请输入关键信息")]
  },
  defaultData: {
    fingerarr: []
  }
});


async function submitCb() {
  emits("select", selectValue.value);
  showHandle.value = false;
}

const selectValue = ref([]);

function select(data) {
  console.log("data0,0,0", data);
  selectValue.value = data;
}
</script>

<template>
  <div
    class="update-form mg-r-sm"
    style="display: inline-block"
    @click="
      openHandle({
        row: {
          ...rowData
        },
        id: props.rowData?.id
      });
    "
  >
    <slot>
      <el-button type="primary">新增</el-button>
    </slot>
  </div>
  <base-dialog @confirm="submitCb()" width="900px" :title="title" v-model="showHandle">
    <div class="details">
      <div class="details-main">
        <FingerText @update="select"></FingerText>
      </div>
    </div>
    <template #footer-more-button></template>
  </base-dialog>
</template>

<style lang="scss" scoped></style>
